<template>
	<view class="container">
		<u-navbar title='付款记录' leftIconColor="#1E272E" :titleStyle="{fontWeight:700,fontSize:'32rpx',color:'#000000'}"
			bgColor="#fff" :auto-back="true"></u-navbar>
		<view class="content">
			<view style="margin-top: 200rpx;" v-if='!payData.length'>
				<u-empty mode="data" textColor="#f56c6c"
					icon="https://qiniushelves.jiachuangnet.com/renovation/img/V6496061742536893385.png">
				</u-empty>
			</view>
			<view class="list">
				<view v-for="item in payData" class="dataInner" @click="payDetail(item)">
					<view style="display: flex;margin-left: 20rpx;">
						<view style="width: 75rpx;">
							<image style="width: 75rpx;height: 75rpx;"
								src="https://qiniushelves.jiachuangnet.com/renovation/img/V3991171742537371044.png">
							</image>
						</view>
						<view style="display: flex;flex-direction: column;margin-left: 20rpx;align-items: flex-start">
							<text>【拉卡拉商户】</text><text
								style="color: DarkGray;margin-left: 15rpx;">{{item.payTime}}</text></view>
					</view>
					<view style="color: #f56c6c;margin-right: 25rpx;font-weight: 600;">{{item.payAmount}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				payData: []
			}
		},
		onLoad(option) {
			this.contractId=option.contractId
		},
		onShow() {
			uni.$u.http.get('/contract/getContractsPayVo',{params:{
				contractId:this.contractId
			}}).then(res=>{
				this.payData=res
				console.log(res,"付款列表");
			})
		},
		methods:{
			payDetail(item){
				uni.navigateTo({
					url:`/pages/comfirmPay/payDetail?data=${JSON.stringify(item)}`
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	.content {
		width: 750rpx;
		position: absolute;
		top: 195rpx;
		left: 50%;
		transform: translate(-50%, 0);
	}

	.list {
		.dataInner {
			width: 750rpx;
			height: 105rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-bottom: 1rpx solid Gainsboro;
			margin-bottom: 20rpx;

		}

	}
</style>